<template>
<div class="box">
  <div class="container">
    <div><span class="icon-service"></span>预约维修服务</div>
    <div><span class="icon-7day"></span>7天无理由退货</div>
    <div><span class="icon-15day"></span>15天免费换货</div>
    <div><span class="icon-post"></span>满150元包邮</div>
  </div>
</div>
</template>

<script>
export default {
name: "ServiceBar"
}
</script>

<style lang="scss" scoped>
@import "src/assets/scss/mixin.scss";
.box{
  padding:33px 0;
  color:#666666;
  font-size:16px;
  .container{
    width: 1126px;
    margin:0 auto;
    div{
      width: 24.9%;
      display: inline-block;
      text-align:center;
      border-right:1px solid #E5E5E5;
      span{
        display: inline-block;
        width: 20px;
        height: 20px;
        vertical-align: middle;
        margin-right: 7px;
      }
      .icon-service{
        @include bgImg(20px,20px,'../../../public/imgs/icon-setting.png')
      }
      .icon-7day{
        @include bgImg(20px,20px,'../../../public/imgs/icon-7day.png')
      }
      .icon-15day{
        @include bgImg(20px,20px,'../../../public/imgs/icon-15day.png')
      }
      .icon-post{
        @include bgImg(20px,20px,'../../../public/imgs/icon-post.png')
      }
    }
  }
}
</style>
